﻿<phone:PhoneApplicationPage xmlns:my="clr-namespace:Microsoft.Advertising.Mobile.UI;assembly=Microsoft.Advertising.Mobile.UI"  
	x:Class="Daltonism.MainPage"
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
	xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
	xmlns:gauges="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.DataVisualization"
	xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
	xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
	xmlns:Daltonism="clr-namespace:Daltonism" xmlns:telerikCore="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Core" mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="800"
	FontFamily="{StaticResource PhoneFontFamilyNormal}"
	FontSize="{StaticResource PhoneFontSizeNormal}"
	Foreground="{StaticResource PhoneForegroundBrush}"
	SupportedOrientations="Portrait" Orientation="Portrait"
	shell:SystemTray.IsVisible="False"
	Loaded="PhoneApplicationPageLoaded"
	Unloaded="PhoneApplicationPageUnloaded">

	<phone:PhoneApplicationPage.Resources>
		<telerikCore:RadFadeAnimation x:Key="rectangleFadeAnimation" />

	</phone:PhoneApplicationPage.Resources>

	<!--LayoutRoot is the root grid where all page content is placed-->
	<Grid x:Name="LayoutRoot" Background="Transparent">

		<Grid.RowDefinitions>
			<RowDefinition Height="80"/>
			<RowDefinition Height="*"/>
		</Grid.RowDefinitions>

		<Grid >
			<my:AdControl x:Name="adControl" ApplicationId="46779b01-941b-4dbc-a46a-369973995ac4" AdUnitId="71775" Width="480" Height="80"/>
		</Grid>
		<!--ContentPanel - place additional content here-->
		<Grid x:Name="ContentPanel" Grid.Row="1">
			
			<Grid.ColumnDefinitions>
				<ColumnDefinition/>
				<ColumnDefinition/>
				<ColumnDefinition/>
			</Grid.ColumnDefinitions>

			<Grid.RowDefinitions>
				<RowDefinition Height="140"/>
				<RowDefinition Height="130"/>
				<RowDefinition Height="130"/>
				<RowDefinition Height="10"/>
				<RowDefinition Height="Auto"/>
				<RowDefinition Height="Auto"/>
				<RowDefinition Height="Auto"/>
				<RowDefinition Height="Auto"/>
				<RowDefinition/>
			</Grid.RowDefinitions>


			<!--Beautiful backround canvas-->
			<Canvas x:Name="drawCanvas"
					Grid.ColumnSpan="3" Grid.RowSpan="10" />

			<!--Main rectangle-->
			<Rectangle x:Name="drawRectangle"
					   RadiusX="20" RadiusY="20"
					   Visibility="Collapsed"
					   Grid.ColumnSpan="3" Grid.RowSpan="3"
					   Margin="40,10,40,00"/>

			<Rectangle x:Name="taskRectangle"
					   RadiusX="20" RadiusY="20"
					   Grid.ColumnSpan="3" Grid.RowSpan="3"
					   Margin="40,10,40,00"/>

			<!--Left side buttons-->
			<Button Content="{Binding Path=Localizedresources.HelpButton, Source={StaticResource LocalizedStrings}}"
					x:Name="HelpButton" Click="HelpButtonClick"
					Height="85" Width="85"
					Margin="0,40,40,0"
					Visibility="Collapsed"
					Grid.Row="0" Grid.Column="0"
					Style="{StaticResource BubbleCreme}"/>
			<Button Content="{Binding Path=Localizedresources.RecallButton, Source={StaticResource LocalizedStrings}}"
					x:Name="RecallButton" Click="RecallButtonClick"
					Height="85" Width="85"
					Margin="0,0,40,0"
					Visibility="Collapsed"
					Grid.Row="1" Grid.Column="0"
					Style="{StaticResource BubbleCreme}"/>
			<Button Content="{Binding Path=Localizedresources.GradeButton, Source={StaticResource LocalizedStrings}}"
					x:Name="GradeButton" Click="GradeButtonClick"
					Height="85" Width="85"
					Margin="0,0,40,30"
					Visibility="Collapsed"
					Grid.Row="2" Grid.Column="0"
					Style="{StaticResource BubbleCreme}"/>

			<!--Right side buttons-->
			<Button Content="{Binding Path=Localizedresources.RedColor, Source={StaticResource LocalizedStrings}}"
					x:Name="RedButton" Click="RedButtonClick"
					Foreground="Red"
					Height="85" Width="85"
					Margin="40,40,0,0"
					Visibility="Collapsed"
					Grid.Row="0" Grid.Column="2"
					Style="{StaticResource BubbleCreme}"/>
			<Button Content="{Binding Path=Localizedresources.GreenColor, Source={StaticResource LocalizedStrings}}"
					x:Name="GreenButton" Click="GreenButtonClick"
					Foreground="Green"
					Height="85" Width="85"
					Margin="40,0,0,0"
					Visibility="Collapsed"
					Grid.Row="1" Grid.Column="2"
					Style="{StaticResource BubbleCreme}"/>
			<Button Content="{Binding Path=Localizedresources.BlueColor, Source={StaticResource LocalizedStrings}}"
					x:Name="BlueButton" Click="BlueButtonClick"
					Foreground="Blue"
					Height="85" Width="85"
					Margin="40,0,0,30"
					Visibility="Collapsed"
					Grid.Row="2" Grid.Column="2"
					Style="{StaticResource BubbleCreme}"/>

			<!--Grade button-->
			<Button x:Name="GradeCloseButton" Click="GradeCloseButtonClick"
					Height="200" Width="200"
					Visibility="Collapsed"
					Grid.Row="0" Grid.Column="0"
					Grid.RowSpan="3" Grid.ColumnSpan="3"
					Style="{StaticResource BubbleCreme}">
				<StackPanel>
					<TextBlock Text="{Binding Path=Localizedresources.GradeMessage, Source={StaticResource LocalizedStrings}}"/>
					<TextBlock x:Name="GradeText" FontWeight="Bold"  FontSize="40" HorizontalAlignment="Center" />
				</StackPanel>
			</Button>

			<!--Close button-->
			<Button Content="{Binding Path=Localizedresources.CloseButton, Source={StaticResource LocalizedStrings}}"
					x:Name="CloseButton" Click="CloseButtonClick"
					Height="40" Width="90"
					Margin="0,50,0,0"
					Visibility="Collapsed"
					Grid.Row="2" Grid.Column="1"
					Style="{StaticResource BubbleCreme}"/>
			<Button Content="{Binding Path=Localizedresources.StartButton, Source={StaticResource LocalizedStrings}}"
					x:Name="StartButton" Click="StartButtonClick"
					Height="40" Width="90"
					Margin="0,50,0,0"
					Grid.Row="2" Grid.Column="1"
					Style="{StaticResource BubbleCreme}"/>

			<!--<gauges:RadialGaugeRange MaxAngle="180"
									 MaxValue="100"
									 TickStep="8.33"
									 MajorTickStep="3"
									 LabelStep="25"
									 LabelRadiusScale="1.03"
									 TickRadiusScale="0.8"
									 SweepDirection="Counterclockwise"
									 Grid.Row="2" Grid.Column="1"
									 Grid.RowSpan="2"
									 Visibility="Collapsed"
									 Margin="0,30,0,-20"
									 x:Name="RadialGauge">

				<gauges:RadialGaugeRange.TickTemplate >
					<DataTemplate>
						<Rectangle Width="0"
								   Height="0"/>
					</DataTemplate>
				</gauges:RadialGaugeRange.TickTemplate>

				<gauges:RadialGaugeRange.MajorTickTemplate>
					<DataTemplate>
						<Rectangle Width="0" Height="0" />
					</DataTemplate>
				</gauges:RadialGaugeRange.MajorTickTemplate>

				<gauges:RadialGaugeRange.LabelTemplate>
					<DataTemplate>
						<TextBlock FontSize="0"/>
					</DataTemplate>
				</gauges:RadialGaugeRange.LabelTemplate>

				<gauges:SegmentedRadialGaugeIndicator Value="100"
													  gauges:RadialGaugeRange.MaxAngle="181"
													  gauges:RadialGaugeRange.MinAngle="-1"
													  gauges:RadialGaugeRange.IndicatorRadiusScale="0.75">
					<gauges:BarIndicatorSegment Length="1"
												Thickness="10"
												Stroke="Black"/>
					<gauges:BarIndicatorSegment Length="1"
												Thickness="11"
												Stroke="Navy"/>
					<gauges:BarIndicatorSegment Length="1"
												Thickness="12"
												Stroke="Blue"/>
					<gauges:BarIndicatorSegment Length="1"
												Thickness="13"
												Stroke="DarkTurquoise"/>
					<gauges:BarIndicatorSegment Length="1"
												Thickness="14"
												Stroke="Turquoise"/>
					<gauges:BarIndicatorSegment Length="1"
												Thickness="15"
												Stroke="GreenYellow"/>
					<gauges:BarIndicatorSegment Length="1"
												Thickness="16"
												Stroke="Yellow"/>
					<gauges:BarIndicatorSegment Length="1"
												Thickness="17"
												Stroke="Gold"/>
					<gauges:BarIndicatorSegment Length="1"
												Thickness="18"
												Stroke="Orange"/>
					<gauges:BarIndicatorSegment Length="1"
												Thickness="19"
												Stroke="OrangeRed"/>
					<gauges:BarIndicatorSegment Length="1"
												Thickness="20"
												Stroke="Red"/>
				</gauges:SegmentedRadialGaugeIndicator>

				<gauges:ArrowGaugeIndicator gauges:RadialGaugeRange.MaxAngle="180"
											gauges:RadialGaugeRange.IndicatorRadiusScale="0.5"
											Value="0"
											gauges:RadialGaugeRange.SweepDirection="Counterclockwise"
											ArrowThickness="3"
											ArrowTailRadius="1.4"
											x:Name="arrowIndicator"
											IsAnimated="True"
											 />

			</gauges:RadialGaugeRange>-->


			<!--Red slider-->
			<Rectangle Fill="{StaticResource PhoneBackgroundBrush}"
					   Opacity="0.8" RadiusX="20" RadiusY="20"
					   Grid.ColumnSpan="3" Grid.Row="4"
					   Margin="0,0,0,10"/>
			<TextBlock Text="{Binding Path=Localizedresources.RedColor, Source={StaticResource LocalizedStrings}}"
					   Foreground="Red"
					   Margin="12,0,0,0"
					   Grid.ColumnSpan="2" Grid.Row="4"/>
			<TextBlock Text="{Binding ElementName=redSlider,Path=Value}"
					   Foreground="Red"
					   Grid.Column="2" Grid.Row="4"/>
			<Daltonism:PhoneSlider x:Name="redSlider"
								Minimum="0" Maximum="255"
								IsEnabled="False"
								Style="{StaticResource sliderStyle}"
								ValueChanged="SliderValueChanged"
								Grid.ColumnSpan="3" Grid.Row="4" 
								Background="#FFFF0000" Foreground="#FFFF0000"/>

			<!--Green slider-->
			<Rectangle Fill="{StaticResource PhoneBackgroundBrush}"
					   Opacity="0.8" RadiusX="20" RadiusY="20"
					   Grid.ColumnSpan="3" Grid.Row="5"
					   Margin="0,0,0,10"/>
			<TextBlock Text="{Binding Path=Localizedresources.GreenColor, Source={StaticResource LocalizedStrings}}"
					   Foreground="Green"
					   Margin="12,0,0,0"
					   Grid.ColumnSpan="2" Grid.Row="5"/>
			<TextBlock Text="{Binding ElementName=greenSlider,Path=Value}"
					   Foreground="Green"
					   Grid.Column="2" Grid.Row="5"/>
			<Daltonism:PhoneSlider x:Name="greenSlider"
								Minimum="0" Maximum="255"
								IsEnabled="False"
								Style="{StaticResource sliderStyle}"
								ValueChanged="SliderValueChanged"
								Grid.ColumnSpan="3" Grid.Row="5"
								Background="#FF00FF00" Foreground="#FF00FF00"/>

			<!--Blue slider-->
			<Rectangle Fill="{StaticResource PhoneBackgroundBrush}"
					   Opacity="0.8" RadiusX="20" RadiusY="20"
					   Grid.ColumnSpan="3" Grid.Row="6"
					   Margin="0,0,0,10"/>
			<TextBlock Text="{Binding Path=Localizedresources.BlueColor, Source={StaticResource LocalizedStrings}}"
					   Foreground="Blue"
					   Margin="12,0,0,0"
					   Grid.ColumnSpan="2" Grid.Row="6"/>
			<TextBlock Text="{Binding ElementName=blueSlider,Path=Value}"
					   Foreground="Blue"
					   Grid.Column="2" Grid.Row="6"/>
			<Daltonism:PhoneSlider x:Name="blueSlider"
								Minimum="0" Maximum="255"
								IsEnabled="False"
								Style="{StaticResource sliderStyle}"
								ValueChanged="SliderValueChanged"
								Grid.ColumnSpan="3" Grid.Row="6" 
								Background="#FF0000FF" Foreground="#FF0000FF"/>

			<!--Check Button-->
			<Button Content="{Binding Path=Localizedresources.CheckButton, Source={StaticResource LocalizedStrings}}"
					Name="CheckButton" Click="CheckButtonClick"
					Margin="120, 0, 120 ,0"
					IsEnabled="False"
					Grid.ColumnSpan="3" Grid.Row="9"
					Style="{StaticResource BubbleCreme}"/>
		</Grid>


	</Grid>

</phone:PhoneApplicationPage>